import { ListPage } from "custom/index";
import DataQueryHistoryTableBefore from './custom/TableBefore'
import TableBefore from './components/TableBefore.vue'
import { getScriptManagePage } from './api'
import { inputDataDialog, settingDialog, onBatch } from './dialog'
import dayjs from 'dayjs'
import CustomFieldColumn from './components/CustomFieldColumn.vue'
const tableBefore = new DataQueryHistoryTableBefore('DataQueryHistoryTableBefore')
tableBefore.setComponent(TableBefore)


const page = new ListPage('DataQueryHistory');

page
  .api(getScriptManagePage)
  .useSearch()
    .addInputItem('keyword', '子账号名称/店铺名称/数据账号')
    .addItem({ prop: 'accountName', label: '子账号名称' })
    .addItem({ prop: 'shopName', label: '店铺名称' })
    .addItem({ prop: 'customerName ', label: '客户名称' })
    .addItem({ prop: 'name', label: '客服姓名' })
    .addItem({ prop: 'flowerName', label: '客服花名' })
    .addNumberRangePicker(['salesRevenueStart', 'salesRevenueEnd'], { label: '销售额' })
    .addNumberRangePicker(['receptionVolumeStart', 'receptionVolumeEnd'], { label: '接待量' })
    .addNumberRangePicker(['conversionRateStart', 'conversionRateEnd'], { label: '转化率' })
    .addNumberRangePicker(['responseTimeStart', 'responseTimeEnd'], { label: '响应时间' })
    .addNumberRangePicker(['qaratioStart', 'qaratioEnd'], { label: '问答比' })
    .addNumberRangePicker(['responseRateStart', 'responseRateEnd'], { label: '回复率' })
    .addDateRangePicker(['dateStart', 'dateEnd'], { label: '服务日期范围' })
    .useDateRangePicker(['createDateStart', 'createDateEnd'], { label: '录入时间范围', clearable: true })
      .setDefault(dayjs().subtract(1, 'day').format('YYYY-MM-DD'), 'createDateStart')
      .setDefault(dayjs().format('YYYY-MM-DD'), 'createDateEnd')
      .upto('PageSearch')
    .end()
  .useTable()
    .useSelectionColumn().end()
    .useColumn('date').label('服务日期').minWidth(140).sortable().end()
    .useColumn('platformName').label('平台').minWidth(140).end()
    .useColumn('name').label('客服姓名').minWidth(200).end()
    .useColumn('customTypeName').label('客服类型').minWidth(200).sortable().end()
    .useColumn('flowerName').label('客服花名').minWidth(140).end()
    .useColumn('no').label('客服工号').minWidth(140).end()
    .useColumn('customerName').label('客户名称').minWidth(140).end()
    .useColumn('shopName').label('店铺名称').minWidth(140).sortable().end()
    .useColumn('accountNo').label('数据账号').minWidth(140).end()
    .useColumn('accountName').label('子账号名称').minWidth(160).sortable().end()
    .useColumn('salesRevenue').label('销售额').minWidth(140).sortable().end()
    .useColumn('receptionVolume').label('接待量').minWidth(140).sortable().end()
    .useColumn('conversionRate').label('转化率').formatter(row => row.conversionRate ? row.conversionRate + '%' : '0%').minWidth(140).sortable().end()
    .useColumn('responseTime').label('响应时间').minWidth(140).end()
    .useColumn('qaratio').label('问答比').formatter(row => row.qaratio ? row.qaratio + '%' : '0%').minWidth(140).sortable().end()
    .useColumn('responseRate').label('回复率').formatter(row => row.responseRate ? row.responseRate + '%' : '0%').minWidth(140).sortable().end()
    .useColumn('createTime').label('录入时间').minWidth(180).sortable().end()
    .useColumn('createUserName').label('录入人').minWidth(140).sortable().end() 
    .useCustomColumn(CustomFieldColumn, 'customField').label('自定义字段').minWidth(200).end()
    .end()
  .usePagination()
    .end()
  .useAuthButton()
    .useItem('setting').content('批量设置').batchDeleteRows(onBatch).end()
    .end()
  .useAuthColumn({ width: 110 })
    .useItem('setting').content('设置').type(row => {
      return row.conversionRateIgnore || row.responseTimeIgnore || row.qARatioIgnore || row.responseRateIgnore ? 'danger' : 'primary'
    }).editRow(settingDialog).end()
    .useItem('edit').content('修改').editRow(inputDataDialog).end()
    .end()
  .addChild(tableBefore, 'table-before')

export default page
